<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="css/mui.min.css" rel="stylesheet" />
		<script src="js/mui.min.js"></script>
		<link rel="stylesheet" type="text/css" href="css/maintop.css"/>
		<link rel="stylesheet" type="text/css" href="css/iconfont.css"/>
	</head>

	<body>
<div id="offCanvasWrapper" class="mui-off-canvas-wrap mui-draggable">
	<!--侧滑菜单部分-->
	<aside id="offCanvasSide" class="mui-off-canvas-left">
		<div id="offCanvasSideScroll" class="mui-scroll-wrapper">
			<div class="mui-scroll">
				
				<div class="topl">
					<img src="images/i.jpg"/>
					<div>名字</div>
				</div>
				<ul class="mui-table-view mui-table-view-chevron mui-table-view-inverted">
					<li class="mui-table-view-cell" id="c1">
						<a class="mui-navigate-right">
							关 1
						</a>
					</li>
					<li class="mui-table-view-cell" id="c2">
						<a class="mui-navigate-right">
							Item 2
						</a>
					</li>
					<li class="mui-table-view-cell">
						<a class="mui-navigate-right">
							Item 3
						</a>
					</li>
					<li class="mui-table-view-cell">
						<a class="mui-navigate-right">
							Item 4
						</a>
					</li>
					<li class="mui-table-view-cell">
						<a class="mui-navigate-right">
							Item 5
						</a>
					</li>
					<li class="mui-table-view-cell">
						<a class="mui-navigate-right">
							Item 6
						</a>
					</li>
				</ul>
			</div>
		</div>
	</aside>
	<!--主界面部分-->
	<div class="mui-inner-wrap">
		<header class="mui-bar mui-bar-nav headee">
			<span id="btn11" class="mui-icon iconfont icon-wode1" style="color: #FFFFFF;"></span>
		    <h1 class="mui-title">帮邦</h1>
		</header>
		<div id="offCanvasContentScroll" class="mui-content mui-scroll-wrapper">
			<div class="mui-content">
	       <!--	       	描述：滑动	       -->
	       	 <div class="mui-slider-item"><img src="images/i.jpg" style="width: 100%; height: 120px;" /></div>
	       <!--描述：九分格-->
	       <div class="dt-a">
		       	<div class="dt-a-l">
		       		<img src="images/ic1.png"/>
		       		<p>职位职位</p>
		       	</div>
		       	<div class="dt-a-l">
		       		<img src="images/ic2.png"/>
		       		<p>职位职位</p>
		       	</div>
		       	<div class="dt-a-l">
		       		<img src="images/ic3.png"/>
		       		<p>职位职位</p>
		       	</div>
		       	<div class="dt-a-l">
		       		<img src="images/ic4.png"/>
		       		<p>职位职位</p>
		       	</div>
		       	<div class="dt-a-l">
		       		<img src="images/ic5.png"/>
		       		<p>职位职位</p>
		       	</div>
		       	<div class="dt-a-l">
		       		<img src="images/ic6.png"/>
		       		<p>职位职位</p>
		       	</div>
		       	<div class="dt-a-l">
		       		<img src="images/ic7.png"/>
		       		<p>职位职位</p>
		       	</div>
		       	<div class="dt-a-l">
		       		<img src="images/ic8.png"/>
		       		<p>职位职位</p>
		       	</div>
	       </div>
	       <!-- 描述：动态   -->
	       <div>
	        <ul class="mui-table-view">
	            <li class="mui-table-view-cell mui-media">
	                <a href="javascript:;">
	                    <img class="mui-media-object mui-pull-left" src="http://placehold.it/40x30">
	                    <div class="mui-media-body">
	                        幸福
	                        <p class="mui-ellipsis">能和心爱的人一起睡觉，是件幸福的事情；可是，打呼噜怎么办？</p>
	                    </div>
	                </a>
	            </li>
	            <li class="mui-table-view-cell mui-media">
	                <a href="javascript:;">
	                    <img class="mui-media-object mui-pull-left" src="http://placehold.it/40x30">
	                    <div class="mui-media-body">
	                        木屋
	                        <p class="mui-ellipsis">想要这样一间小木屋，夏天挫冰吃瓜，冬天围炉取暖.</p>
	                    </div>
	                </a>
	            </li>
	            <li class="mui-table-view-cell mui-media">
	                <a href="javascript:;">
	                    <img class="mui-media-object mui-pull-left" src="http://placehold.it/40x30">
	                    <div class="mui-media-body">
	                        CBD
	                        <p class="mui-ellipsis">烤炉模式的城，到黄昏，如同打翻的调色盘一般.</p>
	                    </div>
	                </a>
	            </li>
	             <li class="mui-table-view-cell mui-media">
	                <a href="javascript:;">
	                    <img class="mui-media-object mui-pull-left" src="http://placehold.it/40x30">
	                    <div class="mui-media-body">
	                        CBD
	                        <p class="mui-ellipsis">烤炉模式的城，到黄昏，如同打翻的调色盘一般.</p>
	                    </div>
	                </a>
	            </li>
	             <li class="mui-table-view-cell mui-media">
	                <a href="javascript:;">
	                    <img class="mui-media-object mui-pull-left" src="http://placehold.it/40x30">
	                    <div class="mui-media-body">
	                        CBD
	                        <p class="mui-ellipsis">烤炉模式的城，到黄昏，如同打翻的调色盘一般.</p>
	                    </div>
	                </a>
	            </li>
	        </ul>
	        </div>
	        
		</div>
		
		</div>
	</div>
</div>
</body>
</html>
<script type="text/javascript" src="js/castapp.js" ></script>
<script>
	ca.init();
	var kai = ['btn11'];
	var guan = ['c1','c2'];
	ca.sideslipNav('main-move',kai,guan);
</script>